﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_LayoutWithoutUserSelect.cshtml";
}

<script src="@Url.Content("~/Scripts/kinetic-v5.1.0.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/workflowdesigner.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/workflowdesigner.min.js")" type="text/javascript"></script>

<form action="" id="uploadform" method="post" enctype="multipart/form-data" onsubmit="tmp()">
    <table>
        <tr>
            <td></td>
            <td>
                <a href='javascript:DownloadScheme()'>Download scheme workflow</a>
            </td>
        </tr>
        <tr>
            <td>
                <input type="file" name="uploadFile" id="uploadFile" style="width:350px">
            </td>
            <td>
                <a href='javascript:UploadScheme()'>Upload  scheme workflow</a>
            </td>
        </tr>
    </table>
</form>
<table>
    <tr>
        <td>Size:</td>
        <td><input id="graphwidth" value="1200" /> x <input id="graphheight" value="600" /></td>
        <td><button onclick="wfdesignerRedraw()">Resize</button></td>
        <td>
            |
        </td>
        <td><button onclick="OnNew()">New</button></td>
        <td><button onclick="OnSave()">Save</button></td>

    </tr>
</table>
<br />
<div id="wfdesigner"></div>

<script>
    var QueryString = function () {
        // This function is anonymous, is executed immediately and
        // the return value is assigned to QueryString!
        var query_string = {};
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split("=");
            // If first entry with this name
            if (typeof query_string[pair[0]] === "undefined") {
                query_string[pair[0]] = pair[1];
                // If second entry with this name
            } else if (typeof query_string[pair[0]] === "string") {
                var arr = [query_string[pair[0]], pair[1]];
                query_string[pair[0]] = arr;
                // If third or later entry with this name
            } else {
                query_string[pair[0]].push(pair[1]);
            }
        }
        return query_string;
    }();

    var schemecode = QueryString.schemeName;
    var processid = QueryString.processid;

    var wfdesigner = undefined;
    function wfdesignerRedraw() {
        var data;

        if (wfdesigner != undefined) {
            data = wfdesigner.data;
            wfdesigner.destroy();
        }

        wfdesigner = new WorkflowDesigner({
            name: 'simpledesigner',
            apiurl: '/Designer/API',
            renderTo: 'wfdesigner',
            imagefolder: '/images/',
            graphwidth: $('#graphwidth').val(),
            graphheight: $('#graphheight').val()
        });

        if (data == undefined) {

            var isreadonly = false;
            if (processid != undefined && processid != '')
                isreadonly = true;

            wfdesigner.load({ schemecode: schemecode, processid: processid, readonly: isreadonly });

        }
        else {
            wfdesigner.data = data;
            wfdesigner.render();
        }
    }

    wfdesignerRedraw();

    function DownloadScheme() {
        wfdesigner.downloadscheme({ schemecode: schemecode });
    }
    function UploadScheme() {
        var file = $('#uploadFile');
        if (file == undefined || file.val().length == 0) {
            alert('You did not select a file to upload!');
            return false;
        }

        wfdesigner.uploadscheme($('#uploadform')[0], function () {
            alert('The file is uploaded!');
        });
    }

    function OnSave() {
        wfdesigner.schemecode = schemecode;

        var err = wfdesigner.validate();
        if (err != undefined && err.length > 0) {
            alert(err);
        }
        else {
            wfdesigner.save(function () {
                alert('The scheme is saved!');
            });
        }
    }
    function OnNew() {
        wfdesigner.create();
    }
</script>